const path = require("path"); // nodejs核心模块，专门用来处理路径问题
const ESLintPlugin = require("eslint-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const  CopyPlugin = require("copy-webpack-plugin");
const {getPagePath} = require("./settingFun")
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const webpack = require("webpack")
let entries =getPagePath(path.resolve(__dirname,"../src/page/**/index.js"),HtmlWebpackPlugin);
module.exports = {
  // 入口
  entry: {
    main : path.resolve(__dirname,"../src/common/main.js"),
    ...entries.entrys
  },
  // 输出
  output: {
    // 所有文件的输出路径
    // 开发模式没有输出
    path: path.resolve(__dirname, "../dist"), // 绝对路径
    // 入口文件打包输出文件名
    filename: "static/js/[name].chunk.js",
  },
  // 加载器
  module: {
    rules: [
      // loader的配置
      {
        // 每个文件只能被其中一个loader配置处理
        oneOf: [
          {
            test: /\.css$/, // 只检测.css文件
            use:[MiniCssExtractPlugin.loader, "css-loader"],
          },
          {
            test: /\.less$/,
            // loader: 'xxx', // 只能使用1个loader
            use: [MiniCssExtractPlugin.loader, "css-loader", "less-loader"]
          },
          {
            test: /\.s[ac]ss$/,
            use:[MiniCssExtractPlugin.loader, "css-loader", "sass-loader"]
          },
          {
            test: /\.(png|jpe?g|gif|webp|svg)$/,
            type: "asset",
            parser: {
              dataUrlCondition: {
                // 小于10kb的图片转base64
                // 优点：减少请求数量  缺点：体积会更大
                maxSize: 10 * 1024, // 10kb
              },
            },
            generator: {
              // 输出图片名称
              // [hash:10] hash值取前10位
              filename: "static/images/[hash:10][ext][query]"
            },
          },
          {
            test: /\.(ttf|woff2?|map3|map4|avi)$/,
            type: "asset/resource",
            generator: {
              // 输出名称
              filename: "static/media/[hash:10][ext][query]",
            },
          },
          {
            test: /\.js$/,
            exclude: /node_modules/, // 排除node_modules下的文件，其他文件都处理
            loader: "babel-loader",
          }
        ],
      },
    ],
  },
  // 插件
  plugins: [
    // new ExtractTextPlugin("styles.css"), 
    // new webpack.optimize.CommonsChunkPlugin('vendor','vendor.js'),
    new MiniCssExtractPlugin(),
    new webpack.ProvidePlugin({
      $:"jquery",
      jQuery:"jquery",
      "window.jQuery":"jquery"
    }),
    // plugin的配置
    new ESLintPlugin({
      // 检测哪些文件
      context: path.resolve(__dirname, "../src"),
    }),
    ...entries.plugins
  ],
  optimization: {
    splitChunks: { 
      chunks: 'all', //将node_modules内库单独打包
    }
  },
  // 开发服务器: 不会输出资源，在内存中编译打包的
  devServer: {
    static:'./',
    host: "localhost", // 启动服务器域名
    port: "3000", // 启动服务器端口号
    open: true, // 是否自动打开浏览器
  },
  resolve: {
		alias: {
			//在 webpack 中设置代码中 @ 符号表示 src 这一层目录
			'@': path.join(__dirname, '../src/')
		}
	},
  // 模式
  mode: "development",
  devtool: "cheap-module-source-map",
};
